<template>
  <div class="home">
    <el-container style="height: 78vh; border: 1px solid #eee">
      <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
        <!-- 菜单栏 -->
        <el-menu class="el-menu-demo" background-color="#f7f7f8" text-color="#zzz"
          style="font-weight:600;" router>
          <el-menu-item v-for="item in nav" :key="item.id" :index="item.path" style="width: 100%;">
            {{ item.name }}
          </el-menu-item>
        </el-menu>
      </el-aside>

      <el-container>
        <el-main>
          <router-view ref="child" @childClick1="childClick1"></router-view>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
import router from '@/router';
export default {
  name: 'manage',
  data() {
    
    return {
      nav: [
        {
          id: 1,
          name: "歌曲",
          path: "/song"
        },
        {
          id: 2,
          name: "留言",
          path: "/msg"
        },
        {
          id: 3,
          name: "幻灯片",
          path: "/slide"
        },
        {
          id: 4,
          name: "用户",
          path: "/user"
        },
      ]
    }
  },
  //设置标题
  created() {
    this.setPageTitle();
  },
  methods: {
    childClick1(){
      this.$emit('childClick1');
    },
    setPageTitle() {
      document.title = this.$route.meta.title || "Bibin";
    },
  },
  //加载后判断token是否为空，或token不等于admin，直接跳回登录页
  mounted() {
    const token = JSON.parse(localStorage.getItem("token"))
    if (token.username !== 'admin' || token === null) {
        this.$router.push('/');
    }
  }
}
</script>